<!--<template>-->


<!--  <div class="main-content-wrapper d-flex flex-column">-->
<!--    <Header/>-->
<!--    <div class="content-page-box-area">-->
<!--      <div class="row">-->
<!--        <div class="col-lg-3 col-md-12">-->
<!--          <aside class="widget-area">-->
<!--            <UserIndex/>-->
<!--            <InterestGroup/>-->
<!--          </aside>-->
<!--        </div>-->
<!--        <DynamicList/>-->
<!--        <HotTopic/>-->
<!--      </div>-->
<!--    </div>-->


<!--  </div>-->



<!--<Footer/>-->
<!--</template>-->

<script setup>

import DynamicList from "@/components/DynamicList.vue";
import UserIndex from "@/components/UserIndex.vue";
import InterestGroup from "@/components/InterestGroup.vue";
import HotTopic from "@/components/HotTopic.vue";
import Footer from "@/components/common/Footer.vue";
import Header from "@/components/common/Header.vue";
</script>


<style scoped>

</style>


<template>
  <div class="main-content-wrapper d-flex flex-column">
    <Header/>

    <div class="content-page-box-area">
      <div class="row">
        <!-- 左侧栏 -->
        <div class="col-lg-3 col-md-12">
          <aside class="widget-area">
            <UserIndex/>
            <InterestGroup/>
          </aside>
        </div>

        <!-- 中间内容区（例如 6 或 9 栅格） -->
        <div class="col-lg-6 col-md-12">
          <DynamicList/>
        </div>

        <!-- 右侧栏 -->
        <div class="col-lg-3 col-md-12">
          <HotTopic/>
        </div>
      </div>
    </div>
  </div>

  <Footer/>
</template>